<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

	<link rel="stylesheet" type="text/css" media="all" href="./css/mobile_common.css?v=20150420" />
	<link rel="stylesheet" type="text/css" media="all" href="./css/echo_app_guide.css?v=20150508" />	

	<title>echo回声</title>
</head>

<body class="echo app-guide">
	<header class="container app-guide-header">
		<hgroup>
			<h1 class="ht">echo回声初体验</h1>
			<h2>了解更多关于echo?<br /><small>点击试试看</small></h2>
		</hgroup>

		<h3>
			<span>欢迎来到echo</span>
			<small>echo回声官方</small>
			<a href="#"></a>
		</h3>
	</header>

	<section class="section-1">
		<h3 class="ht">在echo你不可不体验的3D奇妙听觉</h3>

		<span class="tip">带上耳机体验哦</span>
		<div class="voice">
			<div class="img-wp">
				<img class="circle" src="./page_images/voice_2.jpg" alt="voice" />
				<a class="btn play-btn" href="#"></a>
			</div>
			<h4>3D听觉虚拟理发店</h4>
			<b>柳丁儿</b>
		</div>
	</section>
	
	<section class="section-2">
		<h3 class="ht">最热门的新奇音乐</h3>

		<div class="voice">
			<div class="img-wp">
				<img class="circle" src="./page_images/voice_3.jpg" alt="voice" />
				<a class="btn play-btn" href="#"></a>
			</div>
			<h4>3D听觉虚拟理发店</h4>
			<b>柳丁儿</b>
		</div>
	</section>

	<section class="section-3">
		<h3 class="ht">忍不住听一遍又一遍 有声表情</h3>

		<div class="voice">
			<div class="img-wp">
				<img class="circle" src="./page_images/voice_4.jpg" alt="voice" />
				<a class="btn play-btn" href="#"></a>
			</div>
			<h4>3D听觉虚拟理发店</h4>
			<b>柳丁儿</b>
		</div>
	</section>

	<section class="section-4">
		<h3 class="ht">关注他们发现更多乐趣</h3>

		<ul>
			<li>
				<div class="user-avatar">
					<img class="circle" src="./page_images/user_2.jpg" alt="user" />
				</div>
				
				<div class="user">
					<span class="user-name">包菜MM</span>
					<p>翻唱达人</p>
				</div>

				<a class="ht btn follow-btn" href="#">关注</a>
			</li>

			<li>
				<div class="user-avatar">
					<img class="circle" src="./page_images/user_3.jpg" alt="user" />
				</div>
				
				<div class="user">
					<span class="user-name">包菜MM</span>
					<p>翻唱达人</p>
				</div>

				<a class="ht btn follow-btn active" href="#">取消关注</a>
			</li>

			<li>
				<div class="user-avatar">
					<img class="circle" src="./page_images/user_1.jpg" alt="user" />
				</div>
				
				<div class="user">
					<span class="user-name">包菜MM</span>
					<p>翻唱达人</p>
				</div>

				<a class="ht btn follow-btn" href="#">关注</a>
			</li>
		</ul>
	</section>

	<section class="section-5">
		<div class="bottom-bg"></div>
		<h3 class="ht">让声音不光只有一种玩法 Have fun</h3>
		<a class="btn ht" href="#">分享此页面</a>
		<a class="return-btn" href="#">返回</a>
	</section>

</body>
</html>